import React,{useState} from 'react';
import { useNavigate } from 'react-router-dom';
import { DatePicker,Form,Input,Button,Card ,notification,message, Select,Tree  } from 'antd';
import { classes_add } from '../../../../api/classesApi/api'
import './Addclasses.scss'

function AddClasses(props) {
    const [form] = Form.useForm();
    const { Option } = Select;
    var ngvigate = useNavigate()
    const config = {
        rules: [
          {
            type: 'object',
            required: true,
            message: 'Please select time!',
          },
        ],
      };
      var [time2, setTime2] = useState({})
      var change2 = (value) => {
        console.log(value);
        setTime2(value)
      }
    const onFinish = (values)=>{
        console.log(values);
        if(values.classes == '' || values.worktime == '' || values.classtype == '' || values.people == ''  || values.lastupdate == ''){
          notification.error({message:'有信息未输入'})
        }else{
            classes_add({classes:values.classes,worktime:values.worktime,classtype:values.classtype,people:values.people,lastupdate: time2.$y + '-' + (time2.$M + 1) + '-' + time2.$D + ' ' + time2.$H + ' : ' + time2.$m}).then((res)=>{
                console.log(res.data);
                notification.success({message:'添加班次信息成功'})
                navigator('/index/checknav/class')
            })
        }
    }
    const onGenderChange = (value) => {
        console.log(value);
        
      };
    return (
        <div className='addclasses'>
        {/* <Card> */}
            <Form
            labelCol={{ span: 6 }}
            wrapperCol={{ span: 18 }}
            onFinish={onFinish}
            // 绑定form实例
            form={form}
          >
            <Form.Item
                     label="默认班次"
                     name="classes"
                     rules={[{ required: true, message: '输入班次名称' }]}
                   
                 >
                     <Input placeholder='输入班次名称'/>
                 </Form.Item>
                 <Form.Item
                     label="出勤时长"
                     name="worktime"
                     rules={[{ required: true, message: '输入出勤时长' }]}
                     
                 >
                     <Input placeholder='输入出勤时长'/>
                 </Form.Item>
                 <Form.Item
                     label="班次类型"
                     name="classtype"
                     rules={[{ required: true }]}
                    
                 >
                    <Select
                      placeholder="Select a option"
                      allowClear
                      onChange={onGenderChange}
                      style={{width:280}}
                    >
                      <Option value="固定班制">固定班制</Option>
                      <Option value="排班制">排班制</Option>
                      <Option value="自由班制">自由班制</Option>
                    </Select>
                 </Form.Item>
                 <Form.Item
                     label="负责人"
                     name="people"
                     rules={[{ required: true, message: '输入负责人名称' }]}
                     
                 >
                     <Input placeholder='输入负责人名称'/>
                 </Form.Item>
                <Form.Item name="lastupdate" label="修改更新时间" {...config}>
                  <DatePicker showTime format="YYYY-MM-DD HH:mm:ss" onChange={change2} />
                </Form.Item>
                <Form.Item wrapperCol={{ offset: 8, span: 16 }}>
                         <Button type="primary" htmlType="submit">提交</Button>
                </Form.Item>
          </Form>
                {/* </Card> */}
                
        </div>
    );
}

export default AddClasses;